﻿<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
    <script src="js/jquery-1.6.2.min.js"></script>
</head>
<body>
<form id="form1">
<div>
    <input type="button" value="Change" onclick="ChangeDom()" />
    <div>
        <div id="dv1" style="width:100px;height:100px;background-color:#ffd800"></div>
        <div id="dv2" style="width:100px;height:100px;background-color:#00ffff"></div>
        <div id="dv3" style="width:100px;height:100px;background-color:#4cff00"></div>
    </div>
</div>

</form>
<script type="text/javascript">
    function ChangeDom()
    {        
        $change = $(document.getElementById('dv3'));               
        var prevDv = $change.prev();

        $change.insertBefore(prevDv);
        //$d1.insertAfter(prevDv);
    }

</script>
</body>
</html>
